<template>
  <div>
    <ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="../../imgs/shuijiao.jpg" alt="睡觉">
						<div class="mui-media-body">
              <h3>幸福</h3>
							<p class='mui-ellipsis'>
                <span>发表时间：2019-12-12 12：54：54</span>
                <span>点击：0次</span>
              </p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="../../imgs/muwu.jpg" alt="木屋">
						<div class="mui-media-body">
              <h3>幸福</h3>
							<p class='mui-ellipsis'>
                <span>发表时间：2019-12-12 12：54：54</span>
                <span>点击：0次</span>
              </p>
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<img class="mui-media-object mui-pull-left" src="../../imgs/cbd.jpg" alt="cbd">
						<div class="mui-media-body">
              <h3>幸福</h3>
							<p class='mui-ellipsis'>
                <span>发表时间：2019-12-12 12：54：54</span>
                <span>点击：0次</span>
              </p>
						</div>
					</a>
				</li>
			</ul>
  </div>
  
</template>
<script>
import {Toast} from 'mint-ui'
import $ from 'jquery';
export default {
  data(){
    return {
      newsList:[]
    }
  },
  created(){
    this.getNewsList()
  },
  methods:{
    getNewsList(){
      $.ajax({
                type:'GET',
                url:'E:\web\vue-pro\src\data.json',
                dataType:'json',
            })
            .then(function(result){
              if(result.body.status===0){
                this.newsList=result.body.message;
              }else{
                Toast('新闻获取失败')
              }
            })
    }
  },

}
</script>
<style lang="less" scoped>
.mui-table-view{
  li{
    h3{
      font-size:14px;
    }
    .mui-ellipsis{
      font-size: 12px;
      color:#226aff;
      display: flex;
      justify-content: space-between
    }
  }
}
</style>



